/* Contrast+ Light — accessibility-focused high-contrast theme
 * Full theme: variables + declarations for light backgrounds
 */

/* ============================================================
   Core variables
   ============================================================ */

html {
  /* Backgrounds */
  --t-bg: #f5f5f7 !important;        /* page background (light neutral) */
  --t-bg-2: #e7e7ec !important;      /* secondary / footers */
  --t-surface: #ffffff !important;   /* post / card surface */
  --t-surface-2: #f0f0f4 !important; /* subtle raised */
  --t-surface-3: #e0e0ea !important; /* hover / emphasis */
  --t-panel: #f8f8fc !important;     /* user info / side panels */

  /* Borders */
  --t-border: #000000 !important;    /* strong black borders */
  --t-border-soft: #555555 !important;

  /* Text */
  --t-text: #111111 !important;      /* main text (very dark) */
  --t-muted: #333333 !important;     /* meta, dates */
  --t-faint: #666666 !important;     /* low-priority text */

  /* Links */
  --t-link: #0047bb !important;      /* strong accessible blue */
  --t-link-hover: #0066ff !important;

  /* Header / accent strip */
  --t-header-top: #ffffff !important;
  --t-header-bottom: #e0e0ea !important;
  --t-header-border: #000000 !important;

  /* Buttons */
  --t-button-top: #0066ff !important;
  --t-button-bottom: #0044cc !important;
  --t-button-hover-top: #1a7eff !important;
  --t-button-hover-bottom: #0055dd !important;
  --t-button-border: #000000 !important;

  /* Legacy row / button helpers */
  --t-row-bg: #ffffff !important;
  --t-row-hover: #f0f0f4 !important;
  --t-row-unread: #fff3d6 !important;
  --t-btn-bg: #0066ff !important;
  --t-btn-text: #ffffff !important;
  --t-btn-border: #000000 !important;
  --t-btn-hover: #1a7eff !important;
  --t-dropdown-bg: #ffffff !important;
  --t-dropdown-hover: #f0f0f4 !important;
}

/* ============================================================
   Page base / reading background
   ============================================================ */

html,
html body,
html #Body,
html .Container,
html .Content.MainContent,
html .page-content,
html .pageBox,
html .MessageList.Discussion,
html .Comments.pageBox {
  background: var(--t-bg) !important;
  color: var(--t-text) !important;
}

/* ============================================================
   Modern title bar (React header)
   ============================================================ */

html .titleBar,
html [class*="TitleBar-classes-bg"],
html [class*="TitleBar-classes-bgContainer"],
html [class*="TitleBar-classes-bar"] {
  background: linear-gradient(
    180deg,
    var(--t-header-top) 0%,
    var(--t-header-bottom) 100%
  ) !important;
  border-bottom: 1px solid var(--t-header-border) !important;
  color: var(--t-text) !important;
}

/* Header nav links 

html [class*="TitleBar-classes-topElement-"] {
  color: var(--t-link) !important;
  background: transparent !important;
}

html [class*="TitleBar-classes-topElement-"]:hover {
  color: var(--t-link-hover) !important;
}

*/

/* Blue pill behind the Boards logo 
html .headerLogo-logoFrame {
  background-color: #255ba3 !important;  /* pick your blue */
  padding: 3px 8px !important;           /* adjust to taste */
  border-radius: 4px !important;         /* optional rounding */
}

*/


/* React header: keep vanilla background, just tweak text/link colours */

html [class*="TitleBar-classes-bg"],
html [class*="TitleBar-classes-bgContainer"],
html [class*="TitleBar-classes-bar"] {
  color: #ffffff !important; /* ensure base text is readable on blue */
}

/* Header nav links */
html [class*="TitleBar-classes-topElement-"] {
  color: #ffffff !important;        /* white links on blue header */
  background: transparent !important;
}

html [class*="TitleBar-classes-topElement-"]:hover {
  color: #ffeb99 !important;        /* light yellow hover for contrast */
}

/* ============================================================
   Breadcrumbs / section headings
   ============================================================ */

html .BreadcrumbsBox,
html .Breadcrumbs,
html .PageTitle,
html .pageHeadingBox {
  background: var(--t-surface-2) !important;
  color: var(--t-text) !important;
  border-color: var(--t-border) !important;
}

/* ============================================================
   Thread list header & side nav header
   ============================================================ */

html .forum-threadlist-header,
html .forum-threadlist-header .latest-title,
html .Box.BoxCategories.SideNav .SideNav-header {
  background: linear-gradient(
    180deg,
    var(--t-header-top) 0%,
    var(--t-header-bottom) 100%
  ) !important;
  color: var(--t-text) !important;
  border-bottom: 1px solid var(--t-header-border) !important;
}

/* ============================================================
   Thread list rows
   ============================================================ */

html .forum-threadlist-table th {
  background: var(--t-surface-2) !important;
  color: var(--t-text) !important;
  border-color: var(--t-border-soft) !important;
}

html .forum-threadlist-table tbody td {
  background: var(--t-surface) !important;
  color: var(--t-text) !important;
  border-color: var(--t-border-soft) !important;
}

html .forum-threadlist-table tbody tr:nth-child(even) td {
  background: var(--t-surface-2) !important;
}

/* Meta columns (replies, views, last post) */

html td.forum-threadlist-lastpost,
html td.forum-threadlist-replies,
html td.forum-threadlist-views,
html .forum-threadlist-thread-lastposter,
html .threadbit-lastposter {
  background: var(--t-surface) !important;
  color: var(--t-muted) !important;
  border-color: var(--t-border-soft) !important;
}

/* ============================================================
   Post header strip
   ============================================================ */

html .postbit-header {
  background: var(--t-surface-2) !important;
  color: var(--t-text) !important;
  border-bottom: 1px solid var(--t-border-soft) !important;
}

html .postbit-header a,
html .postbit-header .MItem {
  color: var(--t-text) !important;
  background: transparent !important;
}

/* ============================================================
   User info column
   ============================================================ */

html .postbit-userinfo,
html .postbit-userinfo .userinfo-row,
html .postbit-userinfo .userinfo-joindate,
html .postbit-userinfo .userinfo-posts,
html .postbit-userinfo .RoleTitle,
html .postbit-userinfo .MItem {
  background: var(--t-panel) !important;
  color: var(--t-muted) !important;
  border-color: var(--t-border-soft) !important;
}

html .postbit-userinfo a,
html .postbit-userinfo .userinfo-username-title {
  color: var(--t-link) !important;
}

/* ============================================================
   Post body / message content
   ============================================================ */

html .postbit-postbody,
html .postbit-message,
html .message-wrapper,
html .Item-BodyWrap,
html .Item-Body,
html .Message.userContent,
html .userContent,
html .UserSignature {
  background: var(--t-surface) !important;
  color: var(--t-text) !important;
  border-color: var(--t-border-soft) !important;
}

/* Typography inside posts */

html .Message.userContent p,
html .Message.userContent div,
html .Message.userContent span,
html .Item-Body p,
html .Item-Body div {
  background: transparent !important;
  color: var(--t-text) !important;
}

/* ============================================================
   Links, quotes, and code blocks
   ============================================================ */

html a {
  color: var(--t-link) !important;
}

html a:hover {
  color: var(--t-link-hover) !important;
}

html blockquote,
html pre,
html code,
html [class*="quoteEmbed"],
html [class*="embedContent"] {
  background: var(--t-surface-2) !important;
  color: var(--t-text) !important;
  border: 1px solid var(--t-border-soft) !important;
}

/* ============================================================
   Reaction row and footer under posts
   ============================================================ */

html .Reactions,
html .Reactions > div,
html .Reactions .ReactButton,
html .Reactions .ReactLabel,
html .clearleft {
  background: var(--t-surface) !important;
  color: var(--t-link) !important;
  border-color: var(--t-border-soft) !important;
}

/* ============================================================
   New Discussion button & primary actions
   ============================================================ */

html .Button,
html .Btn,
html .Primary,
html input[type="submit"],
html .ButtonGroup.NewDiscussion,
html div.ButtonGroup[data-is-kludged="true"],
html .BoxButtons .ButtonGroup.Multi {
  background: linear-gradient(
    180deg,
    var(--t-button-top) 0%,
    var(--t-button-bottom) 100%
  ) !important;
  color: var(--t-btn-text) !important;
  border: 1px solid var(--t-button-border) !important;
}

html .Button:hover,
html .Btn:hover,
html .Primary:hover,
html input[type="submit"]:hover {
  background: linear-gradient(
    180deg,
    var(--t-button-hover-top) 0%,
    var(--t-button-hover-bottom) 100%
  ) !important;
}

/* Soften strong box-shadows */

html .MessageList.Discussion,
html .Comments.pageBox,
html .postbit-wrapper {
  box-shadow: none !important;
}

/* ============================================================
   BoardsCleaner extension UI buttons (Light Contrast+)
   ============================================================ */

/* Toggle Profile button */

html #profileToggleBtn {
  background-color: var(--t-button-top) !important;
  color: var(--t-btn-text) !important;
  border: 1px solid var(--t-button-border) !important;
}

html #profileToggleBtn:hover {
  background-color: var(--t-button-hover-top) !important;
}

/* Info / nav icon buttons in the overlay */

html .infoIcon,
html .navIcon {
  background-color: var(--t-surface-2) !important;
  color: var(--t-text) !important;
  border-color: var(--t-border-soft) !important;
}

/* Shortcut / help dialog */

html dialog#shortcutDialog {
  background: var(--t-surface) !important;
  color: var(--t-text) !important;
  border-color: var(--t-border-soft) !important;
}

/* Edit modal button in forum header */

html #bcEditModalBtn {
  background-color: var(--t-button-top) !important;
  color: var(--t-btn-text) !important;
  border: 1px solid var(--t-button-border) !important;
}

/* ============================================================
   Legacy nav popup (Light Contrast+)
   ============================================================ */

html #bc-nav-popup-wrap {
  position: relative;
}

html #bc-nav-popup-toggle {
  background: linear-gradient(
    180deg,
    var(--t-button-top) 0%,
    var(--t-button-bottom) 100%
  ) !important;
  color: var(--t-btn-text) !important;
  border: 1px solid var(--t-button-border) !important;
  border-radius: 4px !important;
  padding: 6px 10px !important;
  cursor: pointer !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15) !important;
}

html #bc-nav-popup-toggle:hover {
  background: linear-gradient(
    180deg,
    var(--t-button-hover-top) 0%,
    var(--t-button-hover-bottom) 100%
  ) !important;
}

html #bc-nav-popup-panel {
  background: var(--t-surface) !important;
  color: var(--t-text) !important;
  border: 1px solid var(--t-border-soft) !important;
  border-radius: 6px !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18) !important;
  padding: 6px !important;
  min-width: 190px !important;
}

html .bc-nav-popup-item,
html #bc-nav-popup-hide-toggle {
  display: block !important;
  width: 100% !important;
  text-align: left !important;
  background: var(--t-surface-2) !important;
  color: var(--t-text) !important;
  border: 1px solid var(--t-border-soft) !important;
  border-radius: 4px !important;
  padding: 8px 10px !important;
  margin: 4px 0 !important;
  cursor: pointer !important;
}

html .bc-nav-popup-item:hover,
html #bc-nav-popup-hide-toggle:hover {
  background: var(--t-surface-3) !important;
  color: var(--t-link) !important;
  border-color: var(--t-border) !important;
}

html #bc-nav-popup-sep {
  height: 1px !important;
  background: var(--t-border-soft) !important;
  margin: 8px 0 !important;
}